<script lang="ts" setup>
import { Page } from '#/components/page';

import EditProvinceCard from './components/edit-province-card.vue';
import ProvinceTree from './components/province-tree.vue';
</script>

<template>
  <Page content-class="h-full">
    <BaseEditProvinceModal />

    <a-row :gutter="[12, 0]" class="h-full">
      <a-col :span="6" class="h-full">
        <div class="h-full w-full rounded-lg bg-white p-2">
          <ProvinceTree :show-action="true" />
        </div>
      </a-col>

      <a-col :span="18" class="h-full">
        <div class="flex h-full flex-1 flex-col rounded-lg bg-white">
          <div>
            {{ '' }}
            <a-button>添加下级菜单</a-button>
          </div>
          <EditProvinceCard />
        </div>
      </a-col>
    </a-row>
  </Page>
</template>
